<template>
  <div :class="[submitConfirmShow ? 'page_body dialog_show' : 'page_body']">
    <div class="home_top">
      <img
        class="home_top_back"
        src="../../assets/image/black_icon01.png"
        alt="返回"
        @click="toBackFn()"
      />
      <div class="home_top_title">{{ topTitle }}</div>
    </div>
    <div class="referee_register_body">
      <div
        style="
          width: 100vw;
          display: flex;
          flex-direction: column;
          align-items: center;
        "
      >
        <div class="referee_register_from_box">
          <!-- 实名认证栏 -->
          <div v-if="stepKey == 1 || stepKey == 4">
            <div class="referee_register_from_item border_item">
              <div class="border_item_popup_box" style="height: 100%">
                <div class="referee_register_from_upload_img">
                  <div class="border_item_title">
                    <div class="border_item_title_tips">*</div>
                    照片
                  </div>
                  <div
                    class="border_item_popup no_value_item"
                    style="width: 4.8rem; height: 0.94rem; line-height: 0.94rem"
                  >
                    请选择大小不超过3M的免冠照
                  </div>
                </div>

                <div class="upload_img_box">
                  <img
                    v-if="userData.photo == null || userData.photo == ''"
                    class="upload_img_box_icon"
                    src="../../assets/image/upload_img_bg03.png"
                  />
                  <img
                    v-if="userData.photo != null && userData.photo != ''"
                    class="upload_img_box_icon"
                    :src="userData.photo"
                  />
                  <input
                    type="file"
                    accept="image/*"
                    ref="uploadImg"
                    id="upload_img_btn"
                    @change="uploadImgBtn($event)"
                    :disabled="!inputKey"
                  />
                </div>
                <img
                  src="../../assets/image/to_icon03.png"
                  class="popup_icon"
                />
              </div>
            </div>
            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                姓名
              </div>
              <input
                class="referee_register_from_item_input"
                placeholder="请输入姓名"
                type="text"
                v-model="userData.name"
                maxlength="6"
                :disabled="!inputKey"
              />
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                国籍
              </div>
              <div class="border_item_popup_box" @click="openPopup('country')">
                <div
                  :class="[
                    userData.country == '请选择'
                      ? 'border_item_popup no_value_item'
                      : 'border_item_popup',
                  ]"
                >
                  {{
                    userData.country == "请选择"
                      ? "请选择您的国籍"
                      : userData.country
                  }}
                </div>
                <img
                  src="../../assets/image/to_icon03.png"
                  class="popup_icon"
                />
              </div>
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                请选择性别
              </div>
              <div class="border_item_popup_box" @click="openPopup('sex')">
                <div
                  :class="[
                    userData.sex == '请选择'
                      ? 'border_item_popup no_value_item'
                      : 'border_item_popup',
                  ]"
                >
                  {{
                    userData.sex == "请选择" ? "请选择您的性别" : userData.sex
                  }}
                </div>
                <img
                  src="../../assets/image/to_icon03.png"
                  class="popup_icon"
                />
              </div>
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                证件类型
              </div>
              <div
                class="border_item_popup_box"
                @click="openPopup('identityType')"
              >
                <div
                  :class="[
                    identityTypevalueObj.label == '请选择'
                      ? 'border_item_popup no_value_item'
                      : 'border_item_popup',
                  ]"
                >
                  {{
                    identityTypevalueObj.label == "请选择"
                      ? "请选择您的证件类型"
                      : identityTypevalueObj.label
                  }}
                </div>
                <img
                  src="../../assets/image/to_icon03.png"
                  class="popup_icon"
                />
              </div>
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                证件号
              </div>
              <input
                class="referee_register_from_item_input"
                placeholder="请输入您的证件号"
                type="text"
                v-model="userData.identity_number"
                maxlength="30"
                :disabled="!inputKey"
              />
            </div>

            <div class="form_title">
              <div class="border_item_title_tips">*</div>
              常住地址
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                省
              </div>
              <div class="border_item_popup_box" @click="openPopup('province')">
                <div
                  :class="[
                    userData.province == '请选择'
                      ? 'border_item_popup no_value_item'
                      : 'border_item_popup',
                  ]"
                >
                  {{
                    userData.province == "请选择"
                      ? "请选择您的省"
                      : userData.province
                  }}
                </div>
                <img
                  src="../../assets/image/to_icon03.png"
                  class="popup_icon"
                />
              </div>
            </div>

            <div
              class="referee_register_from_item border_item"
              style="flex-direction: row; justify-content: space-between"
            >
              <div class="border_item_child">
                <div class="border_item_title">
                  <div class="border_item_title_tips">*</div>
                  市
                </div>
                <div class="border_item_popup_box" @click="openPopup('city')">
                  <div
                    :class="[
                      userData.city == '请选择'
                        ? 'border_item_popup no_value_item'
                        : 'border_item_popup',
                    ]"
                    style="width: 100%"
                  >
                    {{
                      userData.city == "请选择" ? "请选择您的市" : userData.city
                    }}
                  </div>
                </div>
              </div>
              <div class="border_item_child">
                <div class="border_item_title">
                  <div class="border_item_title_tips">*</div>
                  区
                </div>
                <div class="border_item_popup_box" @click="openPopup('region')">
                  <div
                    :class="[
                      userData.region == '请选择'
                        ? 'border_item_popup no_value_item'
                        : 'border_item_popup',
                    ]"
                    style="width: 100%"
                  >
                    {{
                      userData.region == "请选择"
                        ? "请选择您的区"
                        : userData.region
                    }}
                  </div>
                </div>
              </div>
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                政治面貌
              </div>
              <div
                class="border_item_popup_box"
                @click="openPopup('political_status')"
              >
                <div
                  :class="[
                    userData.political_status == '请选择'
                      ? 'border_item_popup no_value_item'
                      : 'border_item_popup',
                  ]"
                >
                  {{
                    userData.political_status == "请选择"
                      ? "请选择您的政治面貌"
                      : userData.political_status
                  }}
                </div>
                <img
                  src="../../assets/image/to_icon03.png"
                  class="popup_icon"
                />
              </div>
            </div>

            <div
              class="referee_register_from_item upload_img_item"
              style="justify-content: space-around; margin-top: 0.4rem"
              v-show="userData.identity_type != 0"
            >
              <div class="upload_file_box" v-show="userData.identity_type == 1">
                <img
                  v-if="
                    userData.identity_up == null || userData.identity_up == ''
                  "
                  class="upload_file_box_img"
                  src="../../assets/image/identity_up_img01.png"
                />
                <img
                  v-if="
                    userData.identity_up != null && userData.identity_up != ''
                  "
                  class="upload_file_box_img"
                  :src="userData.identity_up"
                />

                <input
                  type="file"
                  accept="image/*"
                  ref="identityUp"
                  class="upload_file_box_input"
                  @change="uploadIdentityBtn($event)"
                  :disabled="!inputKey"
                />
                <div class="upload_file_box_btn">+上传身份证人像面</div>
              </div>
              <div class="upload_file_box" v-show="userData.identity_type == 1">
                <img
                  v-if="
                    userData.identity_down == null ||
                    userData.identity_down == ''
                  "
                  class="upload_file_box_img"
                  src="../../assets/image/identity_down_img01.png"
                />
                <img
                  v-if="
                    userData.identity_down != null &&
                    userData.identity_down != ''
                  "
                  class="upload_file_box_img"
                  :src="userData.identity_down"
                />
                <input
                  type="file"
                  accept="image/*"
                  ref="identityDown"
                  class="upload_file_box_input"
                  @change="uploadIdentityDownBtn($event)"
                  :disabled="!inputKey"
                />
                <div class="upload_file_box_btn">+上传身份证国徽面</div>
              </div>
              <div class="upload_file_box" v-show="userData.identity_type == 2">
                <img
                  v-if="
                    userData.identity_up == null || userData.identity_up == ''
                  "
                  class="upload_file_box_img"
                  src="../../assets/image/upload_img_bg02.png"
                />
                <img
                  v-if="
                    userData.identity_up != null && userData.identity_up != ''
                  "
                  class="upload_file_box_img"
                  :src="userData.identity_up"
                />
                <input
                  type="file"
                  accept="image/*"
                  ref="uploadUpImg"
                  class="upload_file_box_input"
                  @change="uploadUpImgBtn($event)"
                  :disabled="!inputKey"
                />
                <div class="upload_file_box_btn">+护照个人信息页</div>
              </div>
              <div class="upload_file_box" v-show="userData.identity_type == 2">
                <img
                  v-if="
                    userData.identity_down == null ||
                    userData.identity_down == ''
                  "
                  class="upload_file_box_img"
                  src="../../assets/image/upload_img_bg02.png"
                />
                <img
                  v-if="
                    userData.identity_down != null &&
                    userData.identity_down != ''
                  "
                  class="upload_file_box_img"
                  :src="userData.identity_down"
                />
                <input
                  type="file"
                  accept="image/*"
                  ref="uploadDownImg"
                  class="upload_file_box_input"
                  @change="uploadDownImgBtn($event)"
                  :disabled="!inputKey"
                />
                <div class="upload_file_box_btn">+护照有效签证页</div>
              </div>
              <div
                class="upload_file_box"
                v-show="
                  userData.identity_type == 3 || userData.identity_type == 4
                "
              >
                <img
                  v-if="
                    userData.identity_up == null || userData.identity_up == ''
                  "
                  class="upload_file_box_img"
                  src="../../assets/image/upload_img_bg02.png"
                />
                <img
                  v-if="
                    userData.identity_up != null && userData.identity_up != ''
                  "
                  class="upload_file_box_img"
                  :src="userData.identity_up"
                />
                <input
                  type="file"
                  accept="image/*"
                  ref="uploadUpImg"
                  class="upload_file_box_input"
                  @change="uploadUpImgBtn($event)"
                  :disabled="!inputKey"
                />
                <div class="upload_file_box_btn">+证件照片</div>
              </div>
            </div>
          </div>
          <!-- 注册信息栏 -->
          <div v-if="stepKey == 2 || stepKey == 4">
            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                注册所在地
              </div>
              <div
                class="border_item_popup_box"
                @click="openPopup('register_region')"
              >
                <div
                  :class="[
                    userData.register_region == '请选择'
                      ? 'border_item_popup no_value_item'
                      : 'border_item_popup',
                  ]"
                >
                  {{
                    userData.register_region == "请选择"
                      ? "请选择您的注册所在地"
                      : userData.register_region
                  }}
                </div>
                <img
                  src="../../assets/image/to_icon03.png"
                  class="popup_icon"
                />
              </div>
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                民族
              </div>
              <input
                class="referee_register_from_item_input"
                placeholder="请输入您的民族"
                type="text"
                v-model="userData.nation"
                maxlength="6"
                :disabled="!inputKey"
              />
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                籍贯
              </div>
              <input
                class="referee_register_from_item_input"
                placeholder="请输入您的籍贯"
                type="text"
                v-model="userData.native_place"
                maxlength="10"
                :disabled="!inputKey"
              />
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                学历
              </div>
              <div
                class="border_item_popup_box"
                @click="openPopup('education')"
              >
                <div
                  :class="[
                    userData.education == '请选择'
                      ? 'border_item_popup no_value_item'
                      : 'border_item_popup',
                  ]"
                >
                  {{
                    userData.education == "请选择"
                      ? "请选择您的学历"
                      : userData.education
                  }}
                </div>
                <img
                  src="../../assets/image/to_icon03.png"
                  class="popup_icon"
                />
              </div>
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                外语语种
              </div>
              <input
                class="referee_register_from_item_input"
                placeholder="请输入您的外语语种"
                type="text"
                v-model="userData.foreign_language"
                maxlength="10"
                :disabled="!inputKey"
              />
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                外语水平
              </div>
              <input
                class="referee_register_from_item_input"
                placeholder="请输入您的外语水平"
                type="text"
                v-model="userData.foreign_language_level"
                maxlength="10"
                :disabled="!inputKey"
              />
            </div>

            <div class="form_tips">
              *提示：“本选项请准确填写，为教练员及裁判员培训服装订购使用。”
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                服装尺寸
                <div class="form_tips_box" @click="viewSizeListFn()">
                  (
                  <img
                    class="view_size_icon"
                    src="../../assets/image/wenhao_icon01.png"
                  />
                  点击查看尺码表)
                </div>
              </div>
              <div
                class="border_item_popup_box"
                @click="openPopup('clothes_size')"
              >
                <div
                  :class="[
                    userData.clothes_size == '请选择'
                      ? 'border_item_popup no_value_item'
                      : 'border_item_popup',
                  ]"
                >
                  {{
                    userData.clothes_size == "请选择"
                      ? "请选择您的服装尺寸"
                      : userData.clothes_size
                  }}
                </div>
                <img
                  src="../../assets/image/to_icon03.png"
                  class="popup_icon"
                />
              </div>
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                鞋码尺寸
              </div>
              <input
                class="referee_register_from_item_input"
                placeholder="请输入您的鞋码尺寸"
                type="number"
                v-model="userData.shoe_size"
                maxlength="5"
                :disabled="!inputKey"
              />
            </div>

            <div
              class="referee_register_from_item border_item"
              style="flex-direction: row; justify-content: space-between"
            >
              <div class="border_item_child">
                <div class="border_item_title">
                  <div class="border_item_title_tips">*</div>
                  身高
                </div>
                <div style="display: flex; align-items: center">
                  <input
                    class="referee_register_from_item_input"
                    placeholder="请输入您的身高"
                    type="number"
                    v-model="userData.height"
                    maxlength="6"
                    :disabled="!inputKey"
                    style="width: 2.2rem"
                  />
                  <div style="color: #333333; font-size: 0.28rem">CM</div>
                </div>
              </div>
              <div class="border_item_child">
                <div class="border_item_title">
                  <div class="border_item_title_tips">*</div>
                  体重
                </div>
                <div style="display: flex; align-items: center">
                  <input
                    class="referee_register_from_item_input"
                    placeholder="请输入您的体重"
                    type="number"
                    v-model="userData.weight"
                    maxlength="6"
                    :disabled="!inputKey"
                    style="width: 2.2rem"
                  />
                  <div style="color: #333333; font-size: 0.28rem">KG</div>
                </div>
              </div>
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                工作或学习单位
              </div>
              <input
                class="referee_register_from_item_input"
                placeholder="请输入您的工作或学习单位"
                type="text"
                v-model="userData.company"
                maxlength="30"
                :disabled="!inputKey"
              />
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                常住地址
              </div>
              <input
                class="referee_register_from_item_input"
                placeholder="请输入您的常住地址"
                type="text"
                v-model="userData.address"
                maxlength="30"
                :disabled="!inputKey"
              />
            </div>
          </div>
          <!-- 信息完善 -->
          <div v-if="stepKey == 3 || stepKey == 4">
            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                裁判员等级
              </div>
              <div
                class="border_item_popup_box"
                @click="openPopup('referee_level')"
              >
                <div
                  :class="[
                    userData.referee_level == '请选择'
                      ? 'border_item_popup no_value_item'
                      : 'border_item_popup',
                  ]"
                >
                  {{
                    userData.referee_level == "请选择"
                      ? "请选择您的裁判员等级"
                      : userData.referee_level
                  }}
                </div>
                <img
                  src="../../assets/image/to_icon03.png"
                  class="popup_icon"
                />
              </div>
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                现批准年份
              </div>
              <input
                class="referee_register_from_item_input"
                placeholder="请输入您的现批准年份"
                type="text"
                v-model="userData.start_date"
                maxlength="10"
                :disabled="!inputKey"
              />
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                <div class="border_item_title_tips">*</div>
                现批准单位
              </div>
              <input
                class="referee_register_from_item_input"
                placeholder="请输入您的现批准单位"
                type="text"
                v-model="userData.referee_region"
                maxlength="30"
                :disabled="!inputKey"
              />
            </div>

            <div class="form_title">
              <div class="border_item_title_tips">*</div>
              执裁经历
            </div>
            <div
              class="referee_register_from_item"
              style="height: auto; margin-bottom: 0.32rem"
            >
              <div class="tournament_shanghai_list">
                <div
                  class="tournament_shanghai_list_item"
                  v-for="(item, index) in userData.tournament_shanghai_val"
                  :key="index"
                >
                  <div class="tournament_shanghai_list_item_box">
                    <div class="tournament_shanghai_list_item_title">
                      赛事: {{ item.year ? item.year + "年" : ""
                      }}{{ item.title }}
                    </div>
                    <div class="tournament_shanghai_list_item_position">
                      职位: {{ item.position.first == 1 ? "主裁判员" : ""
                      }}{{
                        item.position.first == 1 &&
                        (item.position.assistant == 1 ||
                          item.position.record == 1)
                          ? "、"
                          : ""
                      }}{{ item.position.assistant == 1 ? "助理裁判员" : ""
                      }}{{
                        item.position.assistant == 1 &&
                        item.position.record == 1
                          ? "、"
                          : ""
                      }}{{ item.position.record == 1 ? "记录台人员" : "" }}
                    </div>
                  </div>
                  <div
                    class="tournament_shanghai_list_item_del"
                    @click="tournamentDelFn(item.id)"
                  >
                    <div class="tournament_shanghai_list_item_del_line"></div>
                  </div>
                </div>
                <div
                  class="tournament_shanghai_list_add"
                  @click="tournamentAddFn()"
                >
                  增加+
                </div>
              </div>
            </div>

            <div class="form_title">
              <div class="border_item_title_tips">*</div>
              上传裁判员证件信息页
              <img
                class="view_size_icon"
                src="../../assets/image/wenhao_icon01.png"
                style="margin: 0.06rem 0px 0px 0.12rem"
                @click="viewUploadTipsFn()"
              />
            </div>

            <div
              class="referee_register_from_item"
              style="
                height: auto;
                margin-bottom: 0.26rem;
                flex-direction: row;
                justify-content: space-between;
              "
            >
              <div class="upload_file_box_noBtn">
                <div
                  class="upload_file_box_noBtn_bg"
                  v-if="
                    userData.pic_first == '' ||
                    userData.pic_first == null ||
                    userData.pic_first == undefined
                  "
                >
                  <img
                    class="upload_file_box_noBtn_icon"
                    src="../../assets/image/upload_img_icon01.png"
                  />
                  <div class="upload_file_box_noBtn_tips">裁判员证件照片页</div>
                </div>
                <img
                  class="upload_file_box_noBtn_img"
                  v-else
                  :src="userData.pic_first"
                />
                <input
                  type="file"
                  accept="image/*"
                  ref="uploadPicFirst"
                  class="upload_file_box_noBtn_input"
                  @change="uploadRefereFirstImgBtn($event)"
                  :disabled="!inputKey"
                />
              </div>

              <div class="upload_file_box_noBtn">
                <div
                  class="upload_file_box_noBtn_bg"
                  v-if="
                    userData.pic_second == '' ||
                    userData.pic_second == null ||
                    userData.pic_second == undefined
                  "
                >
                  <img
                    class="upload_file_box_noBtn_icon"
                    src="../../assets/image/upload_img_icon01.png"
                  />
                  <div class="upload_file_box_noBtn_tips">裁判员证件等级页</div>
                </div>
                <img
                  class="upload_file_box_noBtn_img"
                  v-else
                  :src="userData.pic_second"
                />
                <input
                  type="file"
                  accept="image/*"
                  ref="uploadPicSecond"
                  class="upload_file_box_noBtn_input"
                  @change="uploadRefereSecondImgBtn($event)"
                  :disabled="!inputKey"
                />
              </div>
            </div>

            <div
              class="referee_register_from_item"
              style="height: auto; margin-bottom: 0.34rem"
            >
              <div class="upload_file_box_noBtn">
                <div
                  class="upload_file_box_noBtn_bg"
                  v-if="
                    userData.pic_third == '' ||
                    userData.pic_third == null ||
                    userData.pic_third == undefined
                  "
                >
                  <img
                    class="upload_file_box_noBtn_icon"
                    src="../../assets/image/upload_img_icon01.png"
                  />
                  <div class="upload_file_box_noBtn_tips">裁判员证件其他页</div>
                </div>
                <img
                  class="upload_file_box_noBtn_img"
                  v-else
                  :src="userData.pic_third"
                />
                <input
                  type="file"
                  accept="image/*"
                  ref="uploadPicThird"
                  class="upload_file_box_noBtn_input"
                  @change="uploadRefereThirdImgBtn($event)"
                  :disabled="!inputKey"
                />
              </div>
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">
                个人账户开户支行（用于发放劳务经费）
              </div>
              <input
                class="referee_register_from_item_input"
                placeholder="如XX银行XX市XX支行"
                type="text"
                v-model="userData.bank_name"
                maxlength="30"
                :disabled="!inputKey"
              />
            </div>

            <div class="referee_register_from_item border_item">
              <div class="border_item_title">个人账户开户账号</div>
              <input
                class="referee_register_from_item_input"
                placeholder="请输入您的个人账户开户账号"
                type="number"
                v-model="userData.bank_account_number"
                maxlength="30"
                :disabled="!inputKey"
              />
            </div>

            <!-- <div class="form_title">
              <div class="border_item_title_tips">*</div>
              上传银行卡正反面照片
            </div>
            <div
              class="referee_register_from_item"
              style="
                height: auto;
                flex-direction: row;
                justify-content: space-between;
              "
            >
              <div class="upload_file_box_noBtn">
                <div
                  class="upload_file_box_noBtn_bg"
                  v-if="
                    userData.bank_card_front == '' ||
                    userData.bank_card_front == null ||
                    userData.bank_card_front == undefined
                  "
                >
                  <img
                    class="upload_file_box_noBtn_icon"
                    src="../../assets/image/upload_img_icon01.png"
                  />
                  <div class="upload_file_box_noBtn_tips">银行卡正面</div>
                </div>
                <img
                  class="upload_file_box_noBtn_img"
                  v-else
                  :src="userData.bank_card_front"
                />
                <input
                  type="file"
                  accept="image/*"
                  ref="uploadBankCardFront"
                  class="upload_file_box_noBtn_input"
                  @change="uploadBankCardFrontImgBtn($event)"
                  :disabled="!inputKey"
                />
              </div>

              <div class="upload_file_box_noBtn">
                <div
                  class="upload_file_box_noBtn_bg"
                  v-if="
                    userData.bank_cark_back == '' ||
                    userData.bank_cark_back == null ||
                    userData.bank_cark_back == undefined
                  "
                >
                  <img
                    class="upload_file_box_noBtn_icon"
                    src="../../assets/image/upload_img_icon01.png"
                  />
                  <div class="upload_file_box_noBtn_tips">银行卡反面</div>
                </div>
                <img
                  class="upload_file_box_noBtn_img"
                  v-else
                  :src="userData.bank_cark_back"
                />
                <input
                  type="file"
                  accept="image/*"
                  ref="uploadBankCardBack"
                  class="upload_file_box_noBtn_input"
                  @change="uploadBankCardBackBtn($event)"
                  :disabled="!inputKey"
                />
              </div>
            </div> -->
          </div>
          <div
            class="referee_register_from_send_btn"
            v-if="stepKey < 4"
            @click="nextStep()"
          >
            下一步
          </div>
        </div>
      </div>
    </div>

    <!-- 尺码表 -->
    <div class="size_list_body" v-show="sizeListShow">
      <div class="size_list_box">
        <img
          src="../../assets/image/close_icon02.png"
          class="size_list_close"
          @click="closeSizeListFn()"
        />
        <div class="size_list">
          <div class="size_list_title">服装尺码表</div>
          <div class="size_list_item_top">
            <div class="size_list_item_top_val">尺码</div>
            <div class="size_list_item_top_val">身高(cm)</div>
            <div class="size_list_item_top_val">体重(斤)</div>
            <div class="size_list_item_top_val">胸围(cm)</div>
            <div class="size_list_item_top_val">臀围(cm)</div>
          </div>
          <div
            class="size_list_item"
            v-for="(item, index) in sizeListData"
            :key="index"
          >
            <div class="size_list_item_val">{{ item.size }}</div>
            <div class="size_list_item_val">{{ item.height }}</div>
            <div class="size_list_item_val">{{ item.weight }}</div>
            <div class="size_list_item_val">{{ item.bust }}</div>
            <div class="size_list_item_val">{{ item.hipline }}</div>
          </div>
        </div>
      </div>
    </div>

    <!-- 裁判员证件上传说明 -->
    <div class="size_list_body" v-show="uploadTipsShow">
      <div class="size_list_box">
        <img
          src="../../assets/image/close_icon02.png"
          class="size_list_close"
          @click="closeUploadTipsFn()"
        />
        <div class="size_list">
          <div class="upload_tips_title">上传说明</div>
          <div class="upload_tips_content">
            1. 请按提示分别上传裁判员证件的照片页, 等级页及其他页的照片。
          </div>
          <div class="upload_tips_content">
            2. 若为国际级裁判员证件, 只用在照片页上传出上传证件正面,
            等级页上传出上传证件背面即可。
          </div>
          <div class="upload_tips_content">
            3. 上传图片大小不得超过3MB, 文件格式应为
            pjpeg/jpeg/jpg/gif/bmp/png。
          </div>
        </div>
      </div>
    </div>

    <!-- 执裁经历添加 -->
    <div class="tournament_add_body" v-show="tournamentAddShow">
      <div class="tournament_add_box">
        <img
          src="../../assets/image/close_icon01.png"
          class="tournament_add_close"
          @click="tournamentAddCloseFn()"
        />
        <div class="tournament_add_title">执裁经历</div>
        <div class="tournament_add_select_box">
          <div class="tournament_add_select_name">赛事年份:&nbsp;&nbsp;</div>
          <div style="width: 3.32rem">
            <div class="tournament_add_box_select_input">
              <div class="border_item_popup_box" style="width: 100%">
                <div
                  :class="[
                    tournamentAddYearVal == '请选择'
                      ? 'border_item_popup no_value_item'
                      : 'border_item_popup',
                  ]"
                  style="width: 3rem"
                >
                  {{ tournamentAddYearVal }}年
                </div>
                <img
                  src="../../assets/image/to_icon03.png"
                  class="popup_icon"
                />
              </div>
            </div>
          </div>
        </div>
        <div class="tournament_add_select_box">
          <div class="tournament_add_select_name">上海市赛事:</div>
          <div style="width: 3.32rem">
            <div class="tournament_add_box_select_input">
              <div
                class="border_item_popup_box"
                @click="openPopup('tournament_add')"
                style="width: 100%"
              >
                <div
                  :class="[
                    tournamentAddVal == '请选择'
                      ? 'border_item_popup no_value_item'
                      : 'border_item_popup',
                  ]"
                  style="width: 3rem"
                >
                  {{ tournamentAddVal }}
                </div>
                <img
                  src="../../assets/image/to_icon03.png"
                  class="popup_icon"
                />
              </div>
            </div>
          </div>
        </div>
        <div
          class="tournament_add_select_box"
          v-show="tournamentAddVal == '其他'"
        >
          <div class="tournament_add_select_name">其他赛事:&nbsp;&nbsp;</div>
          <div style="width: 3.32rem">
            <div class="tournament_add_box_select_input">
              <input
                placeholder="请输入"
                class="referee_register_from_item_input"
                type="text"
                v-model="tournamentAddValOther"
              />
            </div>
          </div>
        </div>
        <div class="tournament_add_position_box">
          <div class="tournament_add_position_name">职位:</div>
          <div style="width: 4.04rem">
            <div class="gender_checked_item">
              <div
                :class="[
                  tournamentAddPosition.first == 1
                    ? 'gender_checked_item_radio item_radio_checked'
                    : 'gender_checked_item_radio',
                ]"
                @click="checkPositionFn('first')"
              ></div>
              <div class="gender_checked_item_title">主裁判员</div>
            </div>
            <div class="gender_checked_item">
              <div
                :class="[
                  tournamentAddPosition.assistant == 1
                    ? 'gender_checked_item_radio item_radio_checked'
                    : 'gender_checked_item_radio',
                ]"
                @click="checkPositionFn('assistant')"
              ></div>
              <div class="gender_checked_item_title">助理裁判员</div>
            </div>
            <div class="gender_checked_item">
              <div
                :class="[
                  tournamentAddPosition.record == 1
                    ? 'gender_checked_item_radio item_radio_checked'
                    : 'gender_checked_item_radio',
                ]"
                @click="checkPositionFn('record')"
              ></div>
              <div class="gender_checked_item_title">记录台人员</div>
            </div>
          </div>
        </div>
        <div class="tournament_add_btn" @click="tournamentAddConfirm()">
          确认
        </div>
      </div>
    </div>

    <!-- 信息提交确认弹窗 -->
    <div class="submit_confirm_body" v-show="submitConfirmShow">
      <div class="submit_confirm_box">
        <div class="submit_confirm_title">确认信息</div>
        <div class="submit_confirm_list">
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">姓名</div>
            <div class="submit_confirm_item_val">{{ userData.name }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">国籍</div>
            <div class="submit_confirm_item_val">{{ userData.country }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">性别</div>
            <div class="submit_confirm_item_val">{{ userData.sex }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">证件类型</div>
            <div class="submit_confirm_item_val">
              {{ identityTypevalueObj.label }}
            </div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">证件号</div>
            <div class="submit_confirm_item_val">
              {{ userData.identity_number }}
            </div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">省</div>
            <div class="submit_confirm_item_val">{{ userData.province }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">市</div>
            <div class="submit_confirm_item_val">{{ userData.city }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">区</div>
            <div class="submit_confirm_item_val">{{ userData.region }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">政治面貌</div>
            <div class="submit_confirm_item_val">
              {{ userData.political_status }}
            </div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">注册所在地</div>
            <div class="submit_confirm_item_val">
              {{ userData.register_region }}
            </div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">民族</div>
            <div class="submit_confirm_item_val">{{ userData.nation }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">籍贯</div>
            <div class="submit_confirm_item_val">
              {{ userData.native_place }}
            </div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">学历</div>
            <div class="submit_confirm_item_val">{{ userData.education }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">外语语种</div>
            <div class="submit_confirm_item_val">
              {{ userData.foreign_language }}
            </div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">外语水平</div>
            <div class="submit_confirm_item_val">
              {{ userData.foreign_language_level }}
            </div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">服装尺寸</div>
            <div class="submit_confirm_item_val">
              {{ userData.clothes_size }}
            </div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">鞋码尺寸</div>
            <div class="submit_confirm_item_val">{{ userData.shoe_size }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">身高</div>
            <div class="submit_confirm_item_val">{{ userData.height }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">体重</div>
            <div class="submit_confirm_item_val">{{ userData.weight }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">工作或学习单位</div>
            <div class="submit_confirm_item_val">{{ userData.company }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">常住地址</div>
            <div class="submit_confirm_item_val">{{ userData.address }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">裁判员等级</div>
            <div class="submit_confirm_item_val">
              {{ userData.referee_level }}
            </div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">现批准年份</div>
            <div class="submit_confirm_item_val">{{ userData.start_date }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">现批准单位</div>
            <div class="submit_confirm_item_val">
              {{ userData.referee_region }}
            </div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">个人账户开户行</div>
            <div class="submit_confirm_item_val">{{ userData.bank_name }}</div>
          </div>
          <div class="submit_confirm_item">
            <div class="submit_confirm_item_name">个人账户账号</div>
            <div class="submit_confirm_item_val">
              {{ userData.bank_account_number }}
            </div>
          </div>
        </div>
        <div class="submit_confirm_btn" @click="submitDataFn()">确认</div>
        <div class="submit_confirm_btn_w" @click="editDataFn()">修改</div>
      </div>
    </div>

    <!-- popup选择器 -->
    <mt-popup
      v-model="popupVisible"
      position="bottom"
      @touchmove.native.stop.prevent
    >
      <div class="popup_body">
        <div class="popup_body_top">
          <div @click="popupCancelFn()" class="popup_body_top_cancel">取消</div>
          <div @click="popupConfirmFn()" class="popup_body_top_confirm">
            确认
          </div>
        </div>
        <mt-picker
          style="width: 100%"
          ref="popupPicker"
          :slots="pickerSlots"
          :visibleItemCount="visibleItemCount"
          :valueKey="valueKey"
          @change="onPickerChange"
        ></mt-picker>
      </div>
    </mt-popup>
  </div>
</template>
<style src="../../assets/css/referee/refereeRegister.css" scoped></style>

<script>
import { MessageBox, Indicator, Toast } from "mint-ui";
import cityListData from "../../../public/data/cityData.json";
import nationalityListData from "../../../public/data/nationality.json";

export default {
  name: "RefereeRegister",
  components: {},
  data() {
    return {
      baseAPIUrl: this.$store.state.baseAPIUrl,
      topTitle: "",
      stepKey: 1, // 步骤条值
      userData: {
        name: "", // 姓名
        photo: "", // 照片
        sex: "请选择", // 性别
        country: "请选择", // 国籍
        identity_type: 0, // 证件类型 1：身份证 2：护照 3：港、澳、台胞证件 4：其它
        identity_number: "", // 证件号
        identity_up: "", // 证件正面
        identity_down: "", // 证件反面
        province: "请选择", // 省
        city: "请选择", // 城市
        region: "请选择", // 区域
        political_status: "请选择", // 政治面貌
        clothes_size: "请选择", // 服装尺寸
        shoe_size: "", // 鞋码
        height: "", // 身高
        weight: "", // 体重
        company: "", // 工作单位
        address: "", // 常住地址
        register_region: "请选择", // 注册所在地
        nation: "", // 民族
        native_place: "", // 籍贯
        education: "请选择", // 学历
        foreign_language: "", // 外语语种
        foreign_language_level: "", // 外语水平
        referee_level: "请选择", // 裁判员等级
        start_date: "", // 现级别批准年份
        referee_region: "", // 现级别批准单位
        tournament_country: false, // 执教经历--国家级赛事
        tournament_country_val: "",
        tournament_shanghai: false, // 执教经历--上海市赛事
        tournament_shanghai_val: [],
        pic_first: "", // 裁判员证件第一页
        pic_second: "", // 裁判员证件第二页
        pic_third: "", // 裁判员证件第三页
        bank_name: "", // 个人账户开户支行
        bank_account_number: "", // 个人账户开户账号
        bank_card_front: "", // 银行卡正面
        bank_cark_back: "", // 银行卡反面
      },
      userCoachId: "", // 学员ID
      uploadUrl: "", // 提交用图片路径Q
      // popup选择相关
      pickerSlots: [], // popup中Slots
      visibleItemCount: 5, // picker备选数
      popupVisible: false, // popup显示
      popupKey: "", // 当前选择器内容
      valueKey: "", // 当 values 为对象数组时，作为文本显示在 Picker 中的对应字段的字段名
      nationalitySlots: [
        {
          flex: 1,
          values: [],
          textAlign: "center",
        },
      ], // 国籍slots
      nationalityChange: "请选择", // 国籍选择值
      sexSlots: [
        {
          flex: 1,
          values: ["请选择", "男", "女"],
          textAlign: "center",
        },
      ], // 性别slots
      sexChange: "请选择", // 性别选择
      identityTypeSlots: [
        {
          flex: 1,
          values: ["请选择", "身份证", "护照", "港、澳、台胞证件", "其他"],
          textAlign: "center",
        },
      ], // 证件类型slots
      identityTypeChange: "请选择", // 证件类型选择
      identityTypevalueObj: {
        value: 0,
        label: "请选择",
      }, // 证件类型选择值
      provinceSlots: [
        {
          flex: 1,
          values: [],
          textAlign: "center",
        },
      ], // 省slots
      provinceChange: "请选择", // 省选择值
      provinceCityData: {}, // 省市区数据集合
      citySlots: [
        {
          flex: 1,
          values: [],
          textAlign: "center",
        },
      ], // 城市slots
      cityChange: "请选择", // 城市选择值
      areaSlots: [
        {
          flex: 1,
          values: [],
          textAlign: "center",
        },
      ], // 区slots
      areaChange: "请选择", // 区选择值
      politicalSlots: [
        {
          flex: 1,
          values: ["请选择", "党员", "群众"],
          textAlign: "center",
        },
      ], // 政治面貌slots
      politicalChange: "请选择", // 政治面貌选择值
      clothingSizeSlots: [
        {
          flex: 1,
          values: [
            "请选择",
            "男士L",
            "男士XL",
            "男士2XL",
            "男士3XL",
            "男士4XL",
            "女士M",
            "女士L",
            "女士XL",
            "女士2XL",
            "女士3XL",
          ],
          textAlign: "center",
        },
      ], // 服装尺寸slots
      clothingSizeChange: "请选择", // 服装尺寸选择值
      inputKey: true, // 输入控制
      uploadIdentityResponse: {
        idname: "",
        idnumber: "",
        uploadUrl: "",
      },
      sizeListShow: false, // 尺码表显示控制
      sizeListData: [
        {
          size: "男士L",
          height: "160-170",
          weight: "105-125",
          bust: "82-90",
          hipline: "84-92",
        },
        {
          size: "男士XL",
          height: "165-175",
          weight: "125-145",
          bust: "88-96",
          hipline: "90-98",
        },
        {
          size: "男士2XL",
          height: "170-180",
          weight: "145-165",
          bust: "94-102",
          hipline: "96-104",
        },
        {
          size: "男士3XL",
          height: "175-185",
          weight: "165-185",
          bust: "100-108",
          hipline: "102-110",
        },
        {
          size: "男士4XL",
          height: "180-190",
          weight: "185-220",
          bust: "106-114",
          hipline: "108-116",
        },
        {
          size: "女士M",
          height: "160-170",
          weight: "90-110",
          bust: "82-90",
          hipline: "84-92",
        },
        {
          size: "女士L",
          height: "165-175",
          weight: "110-120",
          bust: "88-96",
          hipline: "90-98",
        },
        {
          size: "女士XL",
          height: "170-180",
          weight: "120-130",
          bust: "94-102",
          hipline: "96-104",
        },
        {
          size: "女士2XL",
          height: "175-185",
          weight: "130-140",
          bust: "100-108",
          hipline: "102-110",
        },
        {
          size: "女士3XL",
          height: "180-190",
          weight: "140-160",
          bust: "106-114",
          hipline: "108-116",
        },
      ], // 尺码表数据
      educationSlots: [
        {
          flex: 1,
          values: ["请选择", "大专", "本科", "硕士研究生", "博士"],
          textAlign: "center",
        },
      ], // 学历slots
      educationChange: "请选择", // 学历选择值
      tournamentAddShow: false, // 执裁经历弹窗显示
      tournamentAddSlots: [
        {
          flex: 1,
          values: [
            "请选择",
            "上海市市运会五人制",
            "上海市市运会三人制",
            "上海市篮球冠军联赛五人制24强赛",
            "上海市篮球冠军联赛五人制60强赛",
            "上海市篮球冠军联赛三人制32强赛",
            "上海市篮球冠军联赛三人制区海选赛",
            "上海市青少年篮球冠军赛",
            "其他",
          ],
          textAlign: "center",
        },
      ], // 执裁经历赛事slots
      tournamentAddChange: "请选择", // 执裁经历赛事选择值
      tournamentAddVal: "请选择", // 执裁经历赛事弹窗显示值
      tournamentAddValOther: "", // 其他赛事填写
      tournamentAddYearVal: "2022", // 执裁经历赛事年份
      tournamentAddPosition: {
        first: 0,
        assistant: 0,
        record: 0,
      }, // 执裁经历职位选择
      refereeLevelSlots: [
        {
          flex: 1,
          values: ["请选择", "三级", "二级", "一级", "国家级", "国际级"],
          textAlign: "center",
        },
      ], // 裁判等级slots
      refereeLevelChange: "请选择", // 裁判等级选择值
      refereeLevelList: [
        {
          value: 1,
          label: "三级",
        },
        {
          value: 2,
          label: "二级",
        },
        {
          value: 3,
          label: "一级",
        },
        {
          value: 4,
          label: "国家级",
        },
        {
          value: 5,
          label: "国际级",
        },
      ], // 裁判等级值字典
      submitConfirmShow: false, // 信息确认弹窗显示
      registerRegionChange: "请选择", // 注册所在地选择值
      registerRegionSlots: [
        {
          flex: 1,
          values: [
            "请选择",
            "黄浦区",
            "徐汇区",
            "长宁区",
            "静安区",
            "普陀区",
            "虹口区",
            "杨浦区",
            "闵行区",
            "宝山区",
            "嘉定区",
            "浦东新区",
            "金山区",
            "松江区",
            "青浦区",
            "奉贤区",
            "崇明区",
          ],
          textAlign: "center",
        },
      ], // 注册所在slots
      uploadTipsShow: false, // 裁判员证件上传说明显示
      isOther: 0, // 是否代替注册 0. 否;1. 是
    };
  },
  created: function () {
    let query = this.$route.query;
    if (query.isother != undefined && query.isother != "") {
      this.isOther = query.isother;
    }

    let provinceSlotsList = ["请选择"];
    let citySlotsList = {};

    cityListData.forEach((element) => {
      provinceSlotsList.push(element.name);
      let obj = {};
      element.children.forEach((item) => {
        obj[item.name] = item.children;
      });
      citySlotsList[element.name] = obj;
    });

    let nationalityList = ["请选择"];

    nationalityListData.forEach((element) => {
      nationalityList.push(element.name_cn);
    });

    this.nationalitySlots[0].values = nationalityList;

    this.provinceSlots[0].values = provinceSlotsList;
    this.provinceCityData = citySlotsList;

    if (this.isOther == 0) {
      this.checkUserInfoFn();
    }
  },
  methods: {
    // 打开popup选择
    openPopup: function (key) {
      let that = this;
      if (this.inputKey) {
        this.popupKey = key;
        this.valueKey = "";
        this.popupVisible = true;
        if (key == "country") {
          this.pickerSlots = this.nationalitySlots;
          this.$refs.popupPicker.setSlotValue(0, this.userData.country);
        }
        if (key == "identityType") {
          this.pickerSlots = this.identityTypeSlots;
          this.$refs.popupPicker.setSlotValue(
            0,
            this.identityTypevalueObj.label
          );
        }
        if (key == "province") {
          this.pickerSlots = this.provinceSlots;
          this.$refs.popupPicker.setSlotValue(0, this.userData.province);
        }
        if (key == "city") {
          // 根据省份选择设置citySlots
          let list = ["请选择"];
          if (
            that.userData.province === "请选择" ||
            that.userData.province === "" ||
            that.userData.province === null
          ) {
            that.citySlots[0].values = list;
          } else {
            let newList = that.provinceCityData[that.userData.province];
            for (let key in newList) {
              list.push(key);
            }
            that.citySlots[0].values = list;
          }
          this.pickerSlots = this.citySlots;
          this.$refs.popupPicker.setSlotValue(0, this.userData.city);
        }
        if (key == "region") {
          // 根据市选择设置areaSlots
          let arealist = ["请选择"];
          if (
            that.userData.city === "请选择" ||
            that.userData.city === "" ||
            that.userData.city === null
          ) {
            that.areaSlots[0].values = arealist;
          } else {
            let newAreaList =
              that.provinceCityData[that.userData.province][that.userData.city];
            newAreaList.forEach((item) => {
              arealist.push(item.name);
            });
            that.areaSlots[0].values = arealist;
          }

          this.pickerSlots = this.areaSlots;
          this.$refs.popupPicker.setSlotValue(0, this.userData.region);
        }
        if (key == "political_status") {
          this.pickerSlots = this.politicalSlots;
          this.$refs.popupPicker.setSlotValue(
            0,
            this.userData.political_status
          );
        }
        if (key == "clothes_size") {
          this.pickerSlots = this.clothingSizeSlots;
          this.$refs.popupPicker.setSlotValue(0, this.userData.clothes_size);
        }
        if (key == "education") {
          this.pickerSlots = this.educationSlots;
          this.$refs.popupPicker.setSlotValue(0, this.userData.education);
        }
        if (key == "tournament_add") {
          this.pickerSlots = this.tournamentAddSlots;
          this.$refs.popupPicker.setSlotValue(0, this.tournamentAddVal);
        }
        if (key == "referee_level") {
          this.pickerSlots = this.refereeLevelSlots;
          this.$refs.popupPicker.setSlotValue(0, this.userData.referee_level);
        }
        if (key == "sex") {
          this.pickerSlots = this.sexSlots;
          this.$refs.popupPicker.setSlotValue(0, this.userData.sex);
        }
        if (key == "register_region") {
          this.pickerSlots = this.registerRegionSlots;
          this.$refs.popupPicker.setSlotValue(0, this.userData.register_region);
        }
      }
    },

    // picker选择
    onPickerChange: function (picker, values) {
      if (this.popupKey == "country") {
        if (values[0]) {
          if (values[0] == "") {
            this.nationalityChange = "请选择";
          } else {
            this.nationalityChange = values[0];
          }
        }
      }
      if (this.popupKey == "identityType") {
        if (values[0]) {
          if (values[0] == "") {
            this.identityTypeChange = "请选择";
          } else {
            this.identityTypeChange = values[0];
          }
        }
      }
      if (this.popupKey == "province") {
        if (values[0]) {
          if (values[0] == "") {
            this.provinceChange = "请选择";
          } else {
            this.provinceChange = values[0];
          }
        }
      }
      if (this.popupKey == "city") {
        if (values[0]) {
          if (values[0] == "") {
            this.cityChange = "请选择";
          } else {
            this.cityChange = values[0];
          }
        }
      }
      if (this.popupKey == "region") {
        if (values[0]) {
          if (values[0] == "") {
            this.areaChange = "请选择";
          } else {
            this.areaChange = values[0];
          }
        }
      }
      if (this.popupKey == "political_status") {
        if (values[0]) {
          if (values[0] == "") {
            this.politicalChange = "请选择";
          } else {
            this.politicalChange = values[0];
          }
        }
      }
      if (this.popupKey == "clothes_size") {
        if (values[0]) {
          if (values[0] == "") {
            this.clothingSizeChange = "请选择";
          } else {
            this.clothingSizeChange = values[0];
          }
        }
      }
      if (this.popupKey == "education") {
        if (values[0]) {
          if (values[0] == "") {
            this.educationChange = "请选择";
          } else {
            this.educationChange = values[0];
          }
        }
      }
      if (this.popupKey == "tournament_add") {
        if (values[0]) {
          if (values[0] == "") {
            this.tournamentAddChange = "请选择";
          } else {
            this.tournamentAddChange = values[0];
          }
        }
      }
      if (this.popupKey == "referee_level") {
        if (values[0]) {
          if (values[0] == "") {
            this.refereeLevelChange = "请选择";
          } else {
            this.refereeLevelChange = values[0];
          }
        }
      }
      if (this.popupKey == "sex") {
        if (values[0]) {
          if (values[0] == "") {
            this.sexChange = "请选择";
          } else {
            this.sexChange = values[0];
          }
        }
      }
      if (this.popupKey == "register_region") {
        if (values[0]) {
          if (values[0] == "") {
            this.registerRegionChange = "请选择";
          } else {
            this.registerRegionChange = values[0];
          }
        }
      }
    },

    // popup弹窗取消
    popupCancelFn: function () {
      let key = this.popupKey;
      if (key == "country") {
        this.nationalityChange = this.userData.country;
      }
      if (key == "identityType") {
        this.identityTypeChange = this.identityTypevalueObj.label;
      }
      if (key == "province") {
        this.provinceChange = this.userData.province;
      }
      if (key == "city") {
        this.cityChange = this.userData.city;
      }
      if (key == "region") {
        this.areaChange = this.userData.region;
      }
      if (key == "political_status") {
        this.politicalChange = this.userData.political_status;
      }
      if (key == "clothes_size") {
        this.clothingSizeChange = this.userData.clothes_size;
      }
      if (key == "education") {
        this.educationChange = this.userData.education;
      }
      if (key == "tournament_add") {
        this.tournamentAddChange = this.tournamentAddVal;
      }
      if (key == "referee_level") {
        this.refereeLevelChange = this.userData.referee_level;
      }
      if (key == "sex") {
        this.sexChange = this.userData.sex;
      }
      if (key == "register_region") {
        this.registerRegionChange = this.userData.register_region;
      }
      this.popupVisible = false;
      this.popupObjVisible = false;
    },

    // popup弹窗确认
    popupConfirmFn: function () {
      let key = this.popupKey;
      if (key == "country") {
        this.userData.country = this.nationalityChange;
      }
      if (key == "identityType") {
        if (this.identityTypevalueObj.label != this.identityTypeChange) {
          this.userData.identity_up = "";
          this.$refs.identityUp.value = "";
          this.userData.identity_down = "";
          this.$refs.identityDown.value = "";
        }
        this.identityTypevalueObj.label = this.identityTypeChange;
        if (this.identityTypeChange === "请选择") {
          this.identityTypevalueObj.value = 0;
        } else if (this.identityTypeChange === "身份证") {
          this.identityTypevalueObj.value = 1;
        } else if (this.identityTypeChange === "护照") {
          this.identityTypevalueObj.value = 2;
        } else if (this.identityTypeChange === "港、澳、台胞证件") {
          this.identityTypevalueObj.value = 3;
        } else {
          this.identityTypevalueObj.value = 4;
        }
        this.userData.identity_type = this.identityTypevalueObj.value;
      }
      if (key == "province") {
        if (this.userData.province != this.provinceChange) {
          this.userData.city = "请选择";
          this.userData.region = "请选择";
        }
        this.userData.province = this.provinceChange;
      }
      if (key == "city") {
        if (this.userData.city != this.cityChange) {
          this.userData.region = "请选择";
        }
        this.userData.city = this.cityChange;
      }
      if (key == "region") {
        this.userData.region = this.areaChange;
      }
      if (key == "political_status") {
        this.userData.political_status = this.politicalChange;
      }
      if (key == "clothes_size") {
        this.userData.clothes_size = this.clothingSizeChange;
      }
      if (key == "education") {
        this.userData.education = this.educationChange;
      }
      if (key == "tournament_add") {
        this.tournamentAddVal = this.tournamentAddChange;
      }
      if (key == "referee_level") {
        this.userData.referee_level = this.refereeLevelChange;
      }
      if (key == "sex") {
        this.userData.sex = this.sexChange;
      }
      if (key == "register_region") {
        this.userData.register_region = this.registerRegionChange;
      }
      this.popupVisible = false;
      this.popupObjVisible = false;
    },

    // 提交信息
    submitDataFn: function () {
      let that = this;
      let url = "/mobile/completeRefereeInfo";
      let levelValue = 0;

      this.refereeLevelList.forEach((k) => {
        if (k.label == this.userData.referee_level) {
          levelValue = k.value;
        }
      });

      let data = {
        name: this.userData.name, // 姓名
        photo: this.userData.photo, // 照片
        sex: this.userData.sex, // 性别
        country: this.userData.country, // 国籍
        identity_type: this.userData.identity_type, // 证件类型 1：身份证 2：护照 3：港、澳、台胞证件 4：其它
        identity_number: this.userData.identity_number, // 证件号
        identity_up: this.userData.identity_up, // 证件正面
        identity_down: this.userData.identity_down, // 证件反面
        province: this.userData.province, // 省
        city: this.userData.city, // 城市
        region: this.userData.region, // 区域
        political_status: this.userData.political_status, // 政治面貌
        clothes_size: this.userData.clothes_size, // 服装尺寸
        shoe_size: this.userData.shoe_size, // 鞋码
        height: this.userData.height, // 身高
        weight: this.userData.weight, // 体重
        company: this.userData.company, // 工作单位
        address: this.userData.address, // 常住地址
        nation: this.userData.nation, // 民族
        register_region: this.userData.register_region, // 注册所在地
        native_place: this.userData.native_place, // 籍贯
        education: this.userData.education, // 学历
        foreign_language: this.userData.foreign_language, // 外语语种
        foreign_language_level: this.userData.foreign_language_level, // 外语水平
        referee_level: levelValue, // 裁判员等级
        start_date: this.userData.start_date, // 现级别批准年份
        referee_region: this.userData.referee_region, // 现级别批准单位
        tournament_country: this.userData.tournament_country_val, // 执教经历--国家级赛事
        tournament_shanghai: this.userData.tournament_shanghai_val, // 执教经历--上海市赛事
        pic_first: this.userData.pic_first, // 裁判员证件第一页
        pic_second: this.userData.pic_second, // 裁判员证件第二页
        pic_third: this.userData.pic_third, // 裁判员证件第三页
        bank_name: this.userData.bank_name, // 个人账户开户支行
        bank_account_number: this.userData.bank_account_number, // 个人账户开户账号
        // bank_card_front: this.userData.bank_card_front, // 银行卡正面
        // bank_cark_back: this.userData.bank_cark_back, // 银行卡反面
        is_own: this.isOther == 0 ? 1 : 2,
      };
      if (this.userCoachId != "" && this.isOther == 0) {
        data.coach_id = this.userCoachId;
      }

      MessageBox.confirm("确认提交?").then(() => {
        Indicator.open();
        that.axios
          .post(url, data)
          .then((response) => {
            Indicator.close();
            if (response.code == 0) {
              that.$store.commit("set_isRegister", 2);
              sessionStorage.removeItem("REFEREEREGISTEROBJ");
              if (levelValue == 1 || levelValue == 2) {
                Toast({
                  message: "注册成功",
                  duration: 3000,
                });
                // 跳转首页
                that.$router.replace({
                  name: "RefereeHome",
                });
              } else {
                // 跳转去会员注册
                that.$router.push({
                  name: "RefereeMemberForm",
                  query: {
                    id: response.coach_id,
                  },
                });
              }
            } else {
              Toast({
                message: response.msg,
                duration: 3000,
              });
            }
          })
          .catch(function (error) {
            Indicator.close();
            console.log(error);
          });
      });
    },

    // 检查是否完善过信息
    checkUserInfoFn: function () {
      let that = this;
      let url = "/mobile/checkUserInfo";
      let data = {};
      Indicator.open();
      this.axios
        .post(url, data)
        .then((response) => {
          Indicator.close();
          if (response.code == 0) {
            that.$store.commit("set_isRegister", response.is_complete);
            if (response.is_complete == 2) {
              that.getDetailDataFn();
              that.topTitle = "修改信息";
            } else {
              that.topTitle = "完善信息";
              let temporary = JSON.parse(
                sessionStorage.getItem("REFEREEREGISTEROBJ")
              );
              if (temporary) {
                that.userData = temporary;
                that.identityTypevalueObj.value = response.info.identity_type;
                if (response.info.identity_type == 1) {
                  that.identityTypevalueObj.label = "身份证";
                }
                if (response.info.identity_type == 2) {
                  that.identityTypevalueObj.label = "护照";
                }
                if (response.info.identity_type == 3) {
                  that.identityTypevalueObj.label = "港、澳、台胞证件";
                }
                if (response.info.identity_type == 4) {
                  that.identityTypevalueObj.label = "其他";
                }
                if (response.info.identity_type == 1) {
                  that.uploadIdentityResponse.idname = response.info.name;
                  that.uploadIdentityResponse.idnumber =
                    response.info.identity_number;
                }
              }
            }
          } else {
            Toast({
              message: response.msg,
              duration: 3000,
            });
          }
        })
        .catch(function (error) {
          Indicator.close();
          console.log(error);
        });
    },

    // 获取用户信息
    getDetailDataFn: function () {
      let that = this;
      let url = "/mobile/getUserInfo";
      let data = {};
      Indicator.open();
      this.axios
        .post(url, data)
        .then((response) => {
          Indicator.close();
          if (response.code == 0) {
            that.userCoachId = response.info.id;
            that.userData.name = response.info.name;
            that.userData.photo = response.info.photo;
            that.userData.sex = response.info.sex;
            that.userData.country = response.info.country;
            that.userData.identity_type = response.info.identity_type;
            that.userData.identity_number = response.info.identity_number;
            that.userData.identity_up = response.info.identity_up;
            that.userData.identity_down = response.info.identity_down;
            that.userData.province = response.info.province;
            that.userData.city = response.info.city;
            that.userData.region = response.info.region;
            that.userData.political_status = response.info.political_status;
            that.userData.clothes_size = response.info.clothes_size;
            that.userData.shoe_size = response.info.shoe_size;
            that.userData.height = response.info.height;
            that.userData.weight = response.info.weight;
            that.userData.company = response.info.company;
            that.userData.address = response.info.address;
            that.identityTypevalueObj.value = response.info.identity_type;
            if (response.info.identity_type == 1) {
              that.identityTypevalueObj.label = "身份证";
            }
            if (response.info.identity_type == 2) {
              that.identityTypevalueObj.label = "护照";
            }
            if (response.info.identity_type == 3) {
              that.identityTypevalueObj.label = "港、澳、台胞证件";
            }
            if (response.info.identity_type == 4) {
              that.identityTypevalueObj.label = "其他";
            }
            if (response.info.identity_type == 1) {
              that.uploadIdentityResponse.idname = response.info.name;
              that.uploadIdentityResponse.idnumber =
                response.info.identity_number;
            }
            that.userData.register_region = response.info.register_region;
            that.userData.nation = response.info.nation;
            that.userData.native_place = response.info.native_place;
            that.userData.education = response.info.education;
            that.userData.foreign_language = response.info.foreign_language;
            that.userData.foreign_language_level =
              response.info.foreign_language_level;

            let levelLabel = "请选择";
            that.refereeLevelList.forEach((k) => {
              if (k.value == response.info.referee_level) {
                levelLabel = k.label;
              }
            });
            that.userData.referee_level = levelLabel;

            that.userData.start_date = response.info.start_date;
            that.userData.referee_region = response.info.referee_region;
            that.userData.tournament_country_val =
              response.info.tournament_country;
            that.userData.tournament_shanghai_val =
              response.info.tournament_shanghai;
            that.userData.pic_first = response.info.pic_first;
            that.userData.pic_second = response.info.pic_second;
            that.userData.pic_third = response.info.pic_third;
            that.userData.bank_name = response.info.bank_name;
            that.userData.bank_account_number =
              response.info.bank_account_number;
            // that.userData.bank_card_front = response.info.bank_card_front;
            // that.userData.bank_cark_back = response.info.bank_cark_back;
          } else {
            Toast({
              message: response.msg,
              duration: 3000,
            });
          }
        })
        .catch(function (error) {
          Indicator.close();
          console.log(error);
        });
    },

    // 上传头像图片
    uploadImgBtn: function (e) {
      let that = this;
      let file = e.target.files[0];
      if (file.size > 1024 * 1024 * 3) {
        Toast({
          message: "照片大小超过3MB",
          duration: 3000,
        });
        that.$refs.uploadImg.value = "";
      } else {
        if (file != undefined && file != null) {
          let reader = new FileReader();
          reader.onload = (res) => {
            let image = new Image();
            image.onload = function () {
              // let width = image.width;
              // let height = image.height;
              // let cl = height / width;
              // if (cl >= 1.28 && cl <= 1.52) {
              that.uploadImgFn(res.target.result);
              // } else {
              //   that.$refs.uploadImg.value = "";
              //   Toast({
              //     message: "照片尺寸不合规",
              //     duration: 3000,
              //   });
              // }
            };
            image.src = res.target.result;
          };
          reader.readAsDataURL(file);
        }
      }
    },

    // 上传图片到服务器
    uploadImgFn: function (imgData) {
      let that = this;
      let url = "/upload/uploadPhoto";
      let data = {
        source: 1,
        file: imgData,
      };
      Indicator.open("上传中...");
      this.axios
        .post(url, JSON.stringify(data))
        .then((response) => {
          Indicator.close();
          if (response.code == 0) {
            if (response.is_face == 1) {
              let path = response.image;
              that.uploadUrl = response.image;
              that.userData.photo = path;
            } else {
              console.log(response.msg);
            }
          } else {
            Toast({
              message: response.msg,
              duration: 3000,
            });
          }
        })
        .catch(function (error) {
          Indicator.close();
          console.log(error);
        });
    },

    // 上传身份证正面
    uploadIdentityBtn: function (e) {
      let that = this;
      let file = e.target.files[0];
      if (file.size > 1024 * 1024 * 3) {
        that.$refs.identityUp.value = "";
        Toast({
          message: "照片大小超过3MB",
          duration: 3000,
        });
      } else {
        if (file != undefined && file != null) {
          let reader = new FileReader();
          reader.onload = (res) => {
            that.uploadIdentityFn(res.target.result, 1);
          };
          reader.readAsDataURL(file);
        }
      }
    },

    // 上传身份证背面
    uploadIdentityDownBtn: function (e) {
      let that = this;
      let file = e.target.files[0];
      if (file.size > 1024 * 1024 * 3) {
        that.$refs.identityDown.value = "";
        Toast({
          message: "照片大小超过3MB",
          duration: 3000,
        });
      } else {
        if (file != undefined && file != null) {
          let reader = new FileReader();
          reader.onload = (res) => {
            that.uploadIdentityFn(res.target.result, 2);
          };
          reader.readAsDataURL(file);
        }
      }
    },

    // 上传身份证到服务器
    uploadIdentityFn: function (imgData, type) {
      let that = this;
      let url = "/upload/uploadCardup";
      let uploadType = type;
      let data = {
        type: uploadType,
        file: imgData,
      };
      Indicator.open("上传中...");
      this.axios
        .post(url, JSON.stringify(data))
        .then((response) => {
          Indicator.close();
          if (response.code == 0) {
            let path = response.image;
            if (uploadType == 1) {
              that.uploadIdentityResponse.uploadUrl = response.image;
              that.uploadIdentityResponse.idname = response.idname;
              that.uploadIdentityResponse.idnumber = response.idnumber;
              that.userData.identity_up = path;
            } else {
              that.userData.identity_down = path;
            }
          } else {
            Toast({
              message: response.msg,
              duration: 3000,
            });
          }
        })
        .catch(function (error) {
          Indicator.close();
          console.log(error);
        });
    },

    // 上传证件照片正面
    uploadUpImgBtn: function (e) {
      let that = this;
      let file = e.target.files[0];
      if (file.size > 1024 * 1024 * 3) {
        Toast({
          message: "照片大小超过3MB",
          duration: 3000,
        });
        that.$refs.uploadUpImg.value = "";
      } else {
        let reader = new FileReader();
        reader.onload = (res) => {
          that.uploadCardImgFn(res.target.result, 1);
        };
        reader.readAsDataURL(file);
      }
    },

    // 上传证件照片背面
    uploadDownImgBtn: function (e) {
      let that = this;
      let file = e.target.files[0];
      if (file.size > 1024 * 1024 * 3) {
        Toast({
          message: "照片大小超过3MB",
          duration: 3000,
        });
        that.$refs.uploadDownImg.value = "";
      } else {
        let reader = new FileReader();
        reader.onload = (res) => {
          that.uploadCardImgFn(res.target.result, 2);
        };
        reader.readAsDataURL(file);
      }
    },

    // 上传证件图片到服务器
    uploadCardImgFn: function (imgData, type) {
      let that = this;
      let url = "/upload/uploadImage";
      let uploadType = type;
      let data = {
        source: 7,
        img: imgData,
      };
      Indicator.open("上传中...");
      this.axios
        .post(url, JSON.stringify(data))
        .then((response) => {
          Indicator.close();
          if (response.code == 0) {
            let path = response.image_path;
            if (uploadType == 1) {
              that.userData.identity_up = path;
            } else {
              that.userData.identity_down = path;
            }
          } else {
            Toast({
              message: response.msg,
              duration: 3000,
            });
          }
        })
        .catch(function (error) {
          Indicator.close();
          console.log(error);
        });
    },

    // 下一步
    nextStep: function () {
      if (this.stepKey == 1) {
        if (
          this.userData.photo == "" ||
          this.userData.name == "" ||
          this.userData.country == "" ||
          this.userData.sex == "" ||
          this.identityTypevalueObj.value == "" ||
          this.identityTypevalueObj.value == 0 ||
          this.userData.identity_number == "" ||
          this.userData.province == "" ||
          this.userData.province == "请选择" ||
          this.userData.city == "" ||
          this.userData.city == "请选择" ||
          this.userData.region == "" ||
          this.userData.region == "请选择" ||
          this.userData.political_status == "" ||
          this.userData.political_status == "请选择" ||
          this.userData.identity_up == ""
        ) {
          Toast({
            message: "请先完善身份信息",
          });
          return false;
        } else {
          if (
            (this.identityTypevalueObj.value == 1 ||
              this.identityTypevalueObj.value == 2) &&
            this.userData.identity_down == ""
          ) {
            Toast({
              message: "请先完善身份信息",
            });
            return false;
          }

          if (this.identityTypevalueObj.value == 1) {
            // 验证身份正则
            let idNumberText =
              /(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}$)/;
            if (!idNumberText.test(this.userData.identity_number)) {
              Toast({
                message: "身份证格式不正确",
              });
              return false;
            } else {
              if (
                this.userData.identity_number !=
                  this.uploadIdentityResponse.idnumber ||
                this.userData.name != this.uploadIdentityResponse.idname
              ) {
                Toast({
                  message: "身份信息与上传照片信息不符",
                });
                return false;
              }
            }
          }
          this.stepKey = this.stepKey + 1;
        }
      } else if (this.stepKey == 2) {
        if (
          this.userData.register_region == "" ||
          this.userData.register_region == "请选择" ||
          this.userData.nation == "" ||
          this.userData.native_place == "" ||
          this.userData.education == "" ||
          this.userData.education == "请选择" ||
          this.userData.foreign_language == "" ||
          this.userData.foreign_language_level == "" ||
          this.userData.clothes_size == "" ||
          this.userData.clothes_size == "请选择" ||
          this.userData.shoe_size == "" ||
          this.userData.height == "" ||
          this.userData.weight == "" ||
          this.userData.company == "" ||
          this.userData.address == ""
        ) {
          Toast({
            message: "请先完善补充信息",
          });
          return false;
        } else {
          this.stepKey = this.stepKey + 1;
        }
      } else if (this.stepKey == 3) {
        if (
          this.userData.referee_level == "" ||
          this.userData.referee_level == "请选择" ||
          this.userData.start_date == "" ||
          this.userData.referee_region == "" ||
          this.userData.pic_first == "" ||
          this.userData.pic_second == ""
          // this.userData.pic_third == ""
        ) {
          Toast({
            message: "请先完善补充信息",
          });
          return false;
        }
        // this.stepKey = this.stepKey + 1;
        // this.inputKey = false;
        this.submitConfirmShow = true;
      }
    },

    // 上传裁判员证件第一页
    uploadRefereFirstImgBtn: function (e) {
      let that = this;
      let file = e.target.files[0];
      if (file.size > 1024 * 1024 * 3) {
        Toast({
          message: "照片大小超过3MB",
          duration: 3000,
        });
        that.$refs.uploadPicFirst.value = "";
      } else {
        let reader = new FileReader();
        reader.onload = (res) => {
          that.uploadRefereFn(res.target.result, 1);
        };
        reader.readAsDataURL(file);
      }
    },

    // 上传裁判员证件第二页
    uploadRefereSecondImgBtn: function (e) {
      let that = this;
      let file = e.target.files[0];
      if (file.size > 1024 * 1024 * 3) {
        Toast({
          message: "照片大小超过3MB",
          duration: 3000,
        });
        that.$refs.uploadPicSecond.value = "";
      } else {
        let reader = new FileReader();
        reader.onload = (res) => {
          that.uploadRefereFn(res.target.result, 2);
        };
        reader.readAsDataURL(file);
      }
    },

    // 上传裁判员证件第三页
    uploadRefereThirdImgBtn: function (e) {
      let that = this;
      let file = e.target.files[0];
      if (file.size > 1024 * 1024 * 3) {
        Toast({
          message: "照片大小超过3MB",
          duration: 3000,
        });
        that.$refs.uploadPicThird.value = "";
      } else {
        let reader = new FileReader();
        reader.onload = (res) => {
          that.uploadRefereFn(res.target.result, 3);
        };
        reader.readAsDataURL(file);
      }
    },

    // 上传裁判员证件到服务器
    uploadRefereFn: function (imgData, type) {
      let that = this;
      let url = "/upload/uploadImage";
      let uploadType = type;
      let data = {
        source: 8,
        img: imgData,
      };
      Indicator.open("上传中...");
      this.axios
        .post(url, JSON.stringify(data))
        .then((response) => {
          Indicator.close();
          if (response.code == 0) {
            let path = response.image_path;
            if (uploadType == 1) {
              that.userData.pic_first = path;
            } else if (uploadType == 2) {
              that.userData.pic_second = path;
            } else {
              that.userData.pic_third = path;
            }
          } else {
            Toast({
              message: response.msg,
              duration: 3000,
            });
          }
        })
        .catch(function (error) {
          Indicator.close();
          console.log(error);
        });
    },

    // 上传银行卡正面
    uploadBankCardFrontImgBtn: function (e) {
      let that = this;
      let file = e.target.files[0];
      if (file.size > 1024 * 1024 * 3) {
        Toast({
          message: "照片大小超过3MB",
          duration: 3000,
        });
        that.$refs.uploadBankCardFront.value = "";
      } else {
        let reader = new FileReader();
        reader.onload = (res) => {
          that.uploadBankFn(res.target.result, 1);
        };
        reader.readAsDataURL(file);
      }
    },

    // 上传银行卡正面
    uploadBankCardBackBtn: function (e) {
      let that = this;
      let file = e.target.files[0];
      if (file.size > 1024 * 1024 * 3) {
        Toast({
          message: "照片大小超过3MB",
          duration: 3000,
        });
        that.$refs.uploadBankCardBack.value = "";
      } else {
        let reader = new FileReader();
        reader.onload = (res) => {
          that.uploadBankFn(res.target.result, 2);
        };
        reader.readAsDataURL(file);
      }
    },

    // 上传银行卡到服务器
    uploadBankFn: function (imgData, type) {
      let that = this;
      let url = "/upload/uploadImage";
      let uploadType = type;
      let data = {
        source: 8,
        img: imgData,
      };
      Indicator.open("上传中...");
      this.axios
        .post(url, JSON.stringify(data))
        .then((response) => {
          Indicator.close();
          if (response.code == 0) {
            let path = response.image_path;
            if (uploadType == 1) {
              that.userData.bank_card_front = path;
            } else if (uploadType == 2) {
              that.userData.bank_cark_back = path;
            }
          } else {
            Toast({
              message: response.msg,
              duration: 3000,
            });
          }
        })
        .catch(function (error) {
          Indicator.close();
          console.log(error);
        });
    },

    // 查看尺码表
    viewSizeListFn: function () {
      this.sizeListShow = true;
    },

    // 关闭查看尺码表
    closeSizeListFn: function () {
      this.sizeListShow = false;
    },

    // 查看尺码表
    viewUploadTipsFn: function () {
      this.uploadTipsShow = true;
    },

    // 关闭查看尺码表
    closeUploadTipsFn: function () {
      this.uploadTipsShow = false;
    },

    // 返回
    toBackFn: function () {
      if (this.stepKey == 1) {
        this.$router.go(-1);
      } else {
        this.stepKey = this.stepKey - 1;
        this.inputKey = true;
      }
    },

    // 修改填写
    editDataFn: function () {
      this.stepKey = 1;
      this.submitConfirmShow = false;
    },

    // 选择性别
    checkSexFn: function (val) {
      if (this.inputKey) {
        this.userData.sex = val;
      }
    },

    // 勾选执教经历
    checkTournamentCountryFn: function () {
      if (this.inputKey) {
        this.userData.tournament_country = !this.userData.tournament_country;
      }
    },

    checkTournamentShanghaiFn: function () {
      if (this.inputKey) {
        this.userData.tournament_shanghai = !this.userData.tournament_shanghai;
      }
    },

    // 移除执裁经历
    tournamentDelFn: function (id) {
      let list = [];
      this.userData.tournament_shanghai_val.forEach((item) => {
        if (item.id != id) {
          list.push(item);
        }
      });
      this.userData.tournament_shanghai_val = list;
    },

    // 添加执裁经历
    tournamentAddFn: function () {
      this.tournamentAddShow = true;
      this.tournamentAddVal = "请选择";
      this.tournamentAddChange = "请选择";
      this.tournamentAddYearVal = "2022";
      this.tournamentAddValOther = "";
      this.tournamentAddPosition = {
        first: 0,
        assistant: 0,
        record: 0,
      };
    },

    // 关闭执裁经历弹窗
    tournamentAddCloseFn: function () {
      this.tournamentAddShow = false;
    },

    // 勾选职位
    checkPositionFn: function (key) {
      this.tournamentAddPosition[key] == 1
        ? (this.tournamentAddPosition[key] = 0)
        : (this.tournamentAddPosition[key] = 1);
    },

    // 确认添加执裁经历
    tournamentAddConfirm: function () {
      if (this.tournamentAddVal == "" || this.tournamentAddVal == "请选择") {
        Toast({
          message: "请选择赛事",
        });
        return false;
      }
      if (this.tournamentAddVal == "其他" && this.tournamentAddValOther == "") {
        Toast({
          message: "请填写其他赛事名称",
        });
        return false;
      }
      if (
        this.tournamentAddPosition.first == 0 &&
        this.tournamentAddPosition.assistant == 0 &&
        this.tournamentAddPosition.record == 0
      ) {
        Toast({
          message: "请勾选至少一项职务",
        });
        return false;
      }

      let key = Date.parse(new Date()) / 1000;
      let obj = {
        year: this.tournamentAddYearVal,
        title:
          this.tournamentAddVal == "其他"
            ? this.tournamentAddValOther
            : this.tournamentAddVal,
        position: this.tournamentAddPosition,
        id: key,
      };

      this.userData.tournament_shanghai_val.push(obj);
      this.tournamentAddShow = false;
    },
  },
  watch: {
    userData: {
      handler(newval) {
        sessionStorage.setItem("REFEREEREGISTEROBJ", JSON.stringify(newval));
      },
      deep: true,
    },
  },
};
</script>
